<!--
 * @Date: 2023-10-17 17:35:40
 * @Auth: 463997479@qq.com
 * @LastEditors: 463997479@qq.com
 * @LastEditTime: 2024-02-28 11:34:01
 * @FilePath: \ztc-web\src\views\assessment\assessmentAdd.vue
-->

<template>
  <div style="padding: 10px 20px">
    <d-table-search
      :columns="columns"
      :request="handleRequest"
      title=""
      :header-cell-style="{
        background: '#f5f7fa',
      }"
      :pagination="{
        background: true,
        layout: 'total, sizes, prev, pager, next, jumper',
        small: 'small',
        pageSizes: [10, 200, 300, 400],
      }"
      :showResearch="true"
      :hasSearch="true"
      :has-page="true"
      border
      ref="tableRef"
    >
      <template #searchData="{ search }">
        <el-space>
          <el-form-item prop="typeName">
            <el-select v-model="search.typeName" placeholder="请选择类型">
              <el-option
                v-for="(item, index) in event_typeid"
                :key="index"
                :label="item.label"
                :value="item.value"
              />
            </el-select>
          </el-form-item>
        </el-space>
        <el-space>
          <el-form-item prop="plateNo">
            <el-input placeholder="请输入车牌" v-model="search.plateNo" />
          </el-form-item>
        </el-space>
        <el-space>
          <el-form-item prop="year">
            <el-date-picker
              v-model="search.year"
              type="year"
              placeholder="请选择年份"
              value-format="YYYY"
            />
          </el-form-item>
        </el-space>
      </template>
      <template #dTableRight>
        <el-button @click="handleAdd" type="primary">新增</el-button>
      </template>
      <template #num="data">
        <div
          @click="handleClick(data.data)"
          style="color: blue; cursor: pointer"
        >
          {{ data.data.num }}
        </div>
      </template>

      <template #action="data">
        <el-button @click="handleUpdate(data.data)" link type="primary"
          >修改</el-button
        >
        <el-button link type="warning">删除</el-button>
      </template>
    </d-table-search>
    <AddAssessmentDialog
      v-model="addShowDialog"
      :data="form"
      @complete="handleComplete"
    />
  </div>
</template>

<script setup>
import DTableSearch from "@/components/Table/tableList.vue";
import AddAssessmentDialog from "./addAssessmentDialog.vue";

import { getList } from "@/api/assessment/index";
import { addBlack } from "@/api/assessment/index";

import { ref } from "vue";

import useUserStore from "@/store/modules/user";
const userStore = useUserStore();
const data = {
  areaNo: "500" + userStore.deptId,
  passTime: "",
  plateNo: "",
  typeName: "",
};
console.log(userStore);
const addShowDialog = ref(false);
const tableRef = ref(null);
const form = ref(Object.assign({}, data));
const columns = [
  {
    type: "index",

    label: "序号",
    width: 62,
  },
  {
    prop: "plateNo",

    label: "车牌号",
  },
  {
    prop: "year",
    label: "考核年度",
  },
  {
    prop: "quarter",
    label: "考核季度",
  },

  {
    prop: "areaNo",
    label: "行政区域",
  },
  {
    prop: "passTime",
    label: "过车时间",
  },

  {
    prop: "操作",
    label: "操作",
    slotName: "action",
    width: 166,
  },
];

const { proxy } = getCurrentInstance();
const { event_typeid } = proxy.useDict("event_typeid");
const handleRequest = (params, done) => {
  console.log(params);
  getList(params).then((res) => {
    console.log(res);
    done({ data: res.rows, total: res.total });
  });
};

const handleAdd = () => {
  form.value = data;

  addShowDialog.value = true;
};
const handleUpdate = (data) => {
  form.value = data;
  addShowDialog.value = true;
};
const handleComplete = (data, done) => {
  addBlack(data).then((res) => {
    done();
    tableRef.value.handleSearch();
  });
};
</script>
